<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title>呼叫云</title>
    <link rel="shortcut icon" href="../img/logox_circle.png">
	<link rel="stylesheet" href="../css/modal_style.css">
    <link rel="stylesheet" href="../css/pintuer.css">
    <link rel="stylesheet" href="../css/admin.css">
    <link rel="stylesheet" href="../css/jquery.searchableSelect.css">
    <script src="../js/jquery-1.11.0.min.js"></script> 
    <script src="../js/config.js"></script>
	<script type="text/javascript" charset="utf-8" src="../js/jquery.leanModal.min.js"></script>
	<script src="../js/pintuer.js"></script>
	<script src="../js/jquery.searchableSelect.js"></script>
	<script src="../js/jQuery.md5.js"></script>
	<script>
		$(function(){
			$('#addAdminUser').leanModal({ top: 110, overlay: 0.45, closeButton: ".hidemodal" });
			
			$("#loginNameStr").click(function(){
				$("#loginNameStrAlert").css("visibility","hidden");
			});
			$("#password").click(function(){
				$("#passwordAlert").css("visibility","hidden");
			});
			$("#nameStr").click(function(){
				$("#nameStrAlert").css("visibility","hidden");
			});
			$("#roleID").click(function(){
				$("#roleIDAlert").css("visibility","hidden");
			});
		});
		
		//添加用户
		function addAdminUser(){
			var ok1=false;
			var ok2=false;
			var ok3=false;
			var ok4=false;
			
			var loginNameStr = $("#loginNameStr").val();
			if(loginNameStr!=""){
				ok1 = true;
			}else{
				$("#loginNameStrAlert").css("visibility","");
			}
			var password = $("#password").val();
			if(password!=""){
				password = $.md5(password);
				ok2 = true;
			}else{
				$("#passwordAlert").css("visibility","");
			}
			var nameStr = $("#nameStr").val();
			if(nameStr!=""){
				ok3 = true;
			}else{
				$("#nameStrAlert").css("visibility","");
			}
			var roleID = $("#roleID").val();
			if(roleID!=""){
				ok4 = true;
			}else{
				$("#roleIDAlert").css("visibility","");
			}
			var emailStr = $("#emailStr").val();
			var phoneStr = $("#phoneStr").val();
			var sex = $("#sex").val();
			var remark = $("#remark").val();
			if(ok1 && ok2 && ok3 && ok4){
				$.ajax({
				 url:serviceConfig.role.addAdminUser,
				 type: "get",
		         data:{
		         	loginName:loginNameStr,
		         	password:password,
		         	name:nameStr,
		         	roleCode:roleID,
		         	email:emailStr,
		         	phone:phoneStr,
		         	sex:sex,
		         	remark:remark
		         },
		         dataType: "json",
		         success:function(data){
		        	 if(data.flag == 1){
		        	 	alert("添加成功");
		        	 	window.location.reload();//刷新当前页面.
		        	 }else if(data.flag == 0){
		        	 	alert("用户名已存在");
		        	 	$("#loginNameStr").val("");
						$("#password").val("");
						$("#nameStr").val("");
						$("#roleID").val("");
						$("#emailStr").val("");
						$("#phoneStr").val("");
						$("#sex").val("1");
						$("#remark").val("");
		        	 }
		         },
		         error:function(data){
		        	 console.log(data);
		         }
			});
            }
		}
	</script>
</head>

<body>
	<div class="panel admin-panel">
			<div class="panel-head"><strong>添加管理用户</strong></div>
			<div style="float:left;width:45%;padding-left:30px;padding-top:20px;">
                <div style="float:left;padding-top:5px;"><strong>用户名：</strong></div>
                <div style="float:left;">
					<input type="text" style="" class="input" id="loginNameStr" name="loginNameStr" placeholder="请填写用户名"/>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="loginNameStrAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写用户名！</div>
                </div>
            </div>
			<div style="float:left;width:55%;padding-left:30px;padding-top:20px;">
                <div style="float:left;padding-top:5px;"><strong>密码：</strong></div>
                <div style="float:left;">
					<input type="password" style="" class="input" id="password" name="password" placeholder="请填写密码"/>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="passwordAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写密码！</div>
                </div>
            </div>
            <div style="float:left;width:45%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>&nbsp;&nbsp;&nbsp;姓名：</strong></div>
                <div style="float:left;">
					<input type="text" style="" class="input" id="nameStr" name="nameStr" placeholder="请填写姓名"/>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="nameStrAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写姓名！</div>
                </div>
            </div>
			<div style="float:left;width:55%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>角色：</strong></div>
                <div style="float:left;">
					<select class="roleCode input" style="width:170px;" id="roleID" name="roleID">
						<option value="">请选择角色</option>
					</select>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="roleIDAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请选择角色！</div>
                </div>
            </div>
            <div style="float:left;width:45%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>手机号：</strong></div>
                <div style="float:left;">
					<input type="number" style="" class="input" id="phoneStr" name="phoneStr" placeholder="请填写手机号"/>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="phoneStrAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写手机号！</div>
                </div>
            </div>
			<div style="float:left;width:55%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>邮箱：</strong></div>
                <div style="float:left;">
					<input type="text" style="" class="input" id="emailStr" name="emailStr" placeholder="请填写邮箱"/>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="emailStrAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写邮箱！</div>
                </div>
            </div>
			<div style="float:left;width:100%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>&nbsp;&nbsp;&nbsp;性别：</strong></div>
                <div style="float:left;">
					<select class="input" style="width:170px;" id="sex" name="sex">
						<option value="1">男</option>
						<option value="2">女</option>
					</select>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="sexSlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请选择性别！</div>
                </div>
            </div>
            <div style="float:left;width:100%;padding-left:30px;">
                <div style="float:left;padding-top:5px;"><strong>&nbsp;&nbsp;&nbsp;备注：</strong></div>
                <div style="float:left;">
					<textarea id="remark" style="width:90%;" class="input" rows="5" cols="50" placeholder="请填写备注" ></textarea>
                </div>
				<div style="float:left;padding-top:3px;">
					<div id="remarkAlert" class="alert alert-yellow" style="width:100%;height:30px;padding:5px;visibility:hidden;">请填写备注！</div>
                </div>
            </div>
            <div style="float:left;width:100%;padding-top:20px;padding-left:100px;">
            	<button class="button bg-main" style="width:80px;" id="" onclick="addAdminUser()">确定</button>
            </div>
        </div>
    </div>
</body></html>